<template>
	<view class="recycle-category-component">
		<view class="recycle-category-body">
			<view
				v-for="(item, index) in list"
				:key="index"
				class="recycle-category-item"
				@click="$emit('recycle', item)"
			>
				<view class="recycle-category-icon">
					<image
						:src="item.icon"
						class="icon-category"
					></image>
				</view>
				<view class="recycle-category-name">{{ item.name }}</view>
			</view>
		</view>
	</view>
</template>

<script>
import { recycleCategoryList } from '@/config'

export default {
	data () {
		return {
			list: recycleCategoryList
		}
	}
}
</script>

<style lang="scss" scoped>
@import './index.scss';
</style>